<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>进货管理 - 小型超市后台管理系统</title>
    <link rel="icon" type="image/x-icon" href="favicon.ico">
    <link rel="stylesheet" href="/css/style.css">
    <style>
        .btn {
            padding: 4px 8px;
            margin: 2px;
            border: none;
            border-radius: 3px;
            cursor: pointer;
            font-size: 12px;
        }
        .btn-approve { background: #28a745; color: white; }
        .btn-reject { background: #dc3545; color: white; }
        .btn-edit { background: #007bff; color: white; }
        .btn-delete { background: #6c757d; color: white; }
        .status-pending { color: #ffc107; font-weight: bold; }
        .status-approved { color: #28a745; font-weight: bold; }
        .status-rejected { color: #dc3545; font-weight: bold; }
        .status-completed { color: #007bff; font-weight: bold; }
        .add-plan-form {
            margin-bottom: 20px;
            padding: 15px;
            background: #f8f9fa;
            border-radius: 5px;
        }
        .add-plan-form input, .add-plan-form select {
            padding: 5px;
            margin: 5px;
            border: 1px solid #ddd;
            border-radius: 3px;
        }
        .add-plan-form button {
            padding: 8px 16px;
            background: #007bff;
            color: white;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <div class="header">
        <img src="../img/logo.png" class="logo" alt="logo">
        <span class="title">超市管理</span>
        <div class="nav">
            <span>后台管理</span>
            <span class="user">admin</span>
        </div>
    </div>
    <div class="sidebar">
        <ul>
            <li><a href="admin.html">系统主页</a></li>
            <li class="active"><a href="purchase.html">进货管理</a></li>
            <li><a href="saleadmin.html">销售管理</a></li>
            <li><a href="stock.html">库存管理</a></li>
            <li><a href="memberadmin.html">会员管理</a></li>
            <li><a href="stats.html">数据统计</a></li>
            <li><a href="index.html">前台POS</a></li>
        </ul>
    </div>
    <div class="main">
        <div class="card">
            <h3>进货计划</h3>
            
            <!-- 添加新计划表单 -->
            <div class="add-plan-form">
                <h4>添加新计划</h4>
                <input type="text" id="newProductName" placeholder="商品名称" required>
                <input type="number" id="newQuantity" placeholder="数量" min="1" required>
                <select id="newStatus">
                    <option value="pending">待审核</option>
                    <option value="approved">已批准</option>
                    <option value="rejected">已拒绝</option>
                    <option value="completed">已完成</option>
                </select>
                <button onclick="addNewPlan()">添加计划</button>
            </div>

            <table width="100%" border="1" cellspacing="0" cellpadding="8">
                <thead>
                    <tr>
                        <th>计划编号</th>
                        <th>商品名称</th>
                        <th>数量</th>
                        <th>状态</th>
                        <th>申请时间</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody id="plansTableBody">
                    <!-- 进货计划数据行 -->
                </tbody>
            </table>
        </div>
        <div class="card">
            <h3>入库记录</h3>
            <table width="100%" border="1" cellspacing="0" cellpadding="8">
                <thead>
                    <tr>
                        <th>入库单号</th>
                        <th>商品名称</th>
                        <th>数量</th>
                        <th>金额</th>
                        <th>时间</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody id="stockInTableBody">
                    <!-- 入库记录数据行 -->
                </tbody>
            </table>
        </div>
    </div>

    <script>
        // 进货计划数据
        let plansData = [];
        // 从API获取进货计划数据
        async function loadPlansData() {
            try {
                console.log('请求获取进货计划表数据...');
                const response = await fetch('/api/plan_getall', {
                    method: 'GET',
                    headers: {
                        'Content-Type': 'application/json'
                    }
                });
                    
                console.log('收到服务器响应:', response.status);
                const data = await response.json();
                console.log('响应数据:', data);
                    
                if (response.ok) {
                    plansData = data; // 将API数据赋值给plansData
                    renderPlans();
                } else {
                    console.error('获取数据失败:', data.error);
                    // 如果API失败，使用默认数据
                    plansData = getDefaultPlansData();
                    renderPlans();
                }
            } catch (error) {
                console.error('获取数据错误:', error);
                // 如果网络错误，使用默认数据
                plansData = getDefaultPlansData();
                renderPlans();
            }
        }

        // 入库记录数据
        let stockInData = [];
        // 从API获取入库记录数据
        async function loadStoreData() {
            try {
                console.log('请求获取入库记录数据...');
                const response = await fetch('/api/store_getall', {
                    method: 'GET',
                    headers: {
                        'Content-Type': 'application/json'
                    }
                });
                    
                console.log('收到服务器响应:', response.status);
                const data = await response.json();
                console.log('响应数据:', data);
                    
                if (response.ok) {
                    stockInData = data; // 将API数据赋值给plansData
                    renderStockIn();
                } else {
                    console.error('获取数据失败:', data.error);
                    renderStockIn();
                }
            } catch (error) {
                console.error('获取数据错误:', error);
                renderStockIn();
            }
        }

        // 渲染进货计划表格
        function renderPlans() {
            
            const tbody = document.getElementById('plansTableBody');
            tbody.innerHTML = '';
            tbody.innerHTML = plansData.map(plan => `
                <tr>
                    <td>${plan.id}</td>
                    <td>${plan.name}</td>
                    <td>${plan.amount}</td>
                    <td><span class="status-${plan.state}">${getStatusText(plan.state)}</span></td>
                    <td>${plan.applyTime}</td>
                    <td>
                        ${plan.status === 'pending' ? `
                            <button class="btn btn-approve" onclick="approvePlan('${plan.id}')">批准</button>
                            <button class="btn btn-reject" onclick="rejectPlan('${plan.id}')">拒绝</button>
                        ` : ''}
                        <button class="btn btn-edit" onclick="editPlan('${plan.id}')">编辑</button>
                        <button class="btn btn-delete" onclick="deletePlan('${plan.id}')">删除</button>
                    </td>
                </tr>
            `).join('');
        }

        // 渲染入库记录表格
        function renderStockIn() {
            const tbody = document.getElementById('stockInTableBody');
            tbody.innerHTML = stockInData.map(record => `
                <tr>
                    <td>${record.id}</td>
                    <td>${record.name}</td>
                    <td>${record.amount}</td>
                    <td>￥${record.price.toFixed(2)}</td>
                    <td>${record.date}</td>
                    <td>
                        <button class="btn btn-edit" onclick="viewStockInDetail('${record.id}')">查看</button>
                    </td>
                </tr>
            `).join('');
        }

        // 获取状态文本
        function getStatusText(status) {
            const statusMap = {
                'pending': '待审核',
                'approved': '已批准',
                'rejected': '已拒绝',
                'completed': '已完成'
            };
            return statusMap[status] || status;
        }

        // 添加新计划
        async function addNewPlan() {
            const productName = document.getElementById('newProductName').value;
            const quantity = document.getElementById('newQuantity').value;
            const status = document.getElementById('newStatus').value;
            if (!productName || !quantity) {
                alert('请填写完整的商品名称和数量');
                return;
            }
            try {
                const req = {
                    name: productName,
                    amount: parseInt(quantity),
                    state: status,
                    operation: "操作"
                };
                console.log('添加进货计划表数据...');
                const response = await fetch('/api/plan_create', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json'
                    },
                    body: JSON.stringify(req)
                });
                    
                console.log('收到服务器响应:', response.status);
                
                // 先读取响应文本
                const responseText = await response.text();
                console.log('服务器响应文本:', responseText);
                
                // 检查响应状态
                if (response.ok) {
                    try {
                        // 尝试解析JSON
                        const data = JSON.parse(responseText);
                        console.log('响应数据:', data);
                        loadPlansData();
                        renderPlans();

                        // 清空表单
                        document.getElementById('newProductName').value = '';
                        document.getElementById('newQuantity').value = '';
                        document.getElementById('newStatus').value = 'pending';
                        alert('计划添加成功！');
                    } catch (jsonError) {
                        console.error('JSON解析错误:', jsonError);
                        // 如果JSON解析失败，但HTTP状态是成功的，认为操作可能成功
                        alert('服务器响应格式错误，但操作可能已成功');
                        loadPlansData();
                        renderPlans();
                    }
                } else {
                    // 处理HTTP错误状态
                    try {
                        const errorData = JSON.parse(responseText);
                        console.error('获取数据失败:', errorData.error);
                        alert('添加计划失败: ' + (errorData.error || '未知错误'));
                    } catch (jsonError) {
                        console.error('服务器错误响应:', responseText);
                        alert('添加计划失败: ' + responseText);
                    }
                }
            } catch (error) {
                console.error('网络请求错误:', error);
                alert('网络连接错误，请检查服务器是否正常运行');
            }
        }

        // 批准计划
        function approvePlan(planId) {
            const plan = plansData.find(p => p.id === planId);
            if (plan) {
                plan.status = 'approved';
                renderPlans();
                alert('计划已批准');
            }
        }

        // 拒绝计划
        function rejectPlan(planId) {
            const plan = plansData.find(p => p.id === planId);
            if (plan) {
                plan.status = 'rejected';
                renderPlans();
                alert('计划已拒绝');
            }
        }

        // 编辑计划
        function editPlan(planId) {
            const plan = plansData.find(p => p.id === planId);
            if (plan) {
                const newName = prompt('请输入新的商品名称:', plan.productName);
                const newQuantity = prompt('请输入新的数量:', plan.quantity);
                
                if (newName && newQuantity) {
                    plan.productName = newName;
                    plan.quantity = parseInt(newQuantity);
                    renderPlans();
                    alert('计划已更新');
                }
            }
        }

        // 删除计划
        async function deletePlan(planId) {
            if (confirm('确定要删除这个计划吗？')) {
                plansData = plansData.filter(p => p.id !== planId);

            try {
                const req = {
                    id: parseInt(planId)
                };
                const response = await fetch('/api/plan_delete', {
                    method: 'DELETE',
                    headers: {
                        'Content-Type': 'application/json'
                        },
                        body: JSON.stringify(req)
                    });
                    
                    console.log('收到服务器响应:', response.status);
                
                    // 先读取响应文本
                    const responseText = await response.text();
                    console.log('服务器响应文本:', responseText);
                
                    // 检查响应状态
                    if (response.ok) {
                        try {
                            // 尝试解析JSON
                            const data = JSON.parse(responseText);
                            console.log('响应数据:', data);
                            loadPlansData();
                            renderPlans();
                            alert('计划删除成功！');
                        } catch (jsonError) {
                            console.error('JSON解析错误:', jsonError);
                            // 如果JSON解析失败，但HTTP状态是成功的，认为操作可能成功
                            alert('服务器响应格式错误，但操作可能已成功');
                            loadPlansData();
                            renderPlans();
                        }
                } else {
                    // 处理HTTP错误状态
                    try {
                        const errorData = JSON.parse(responseText);
                        console.error('获取数据失败:', errorData.error);
                        alert('添加计划失败: ' + (errorData.error || '未知错误'));
                    } catch (jsonError) {
                        console.error('服务器错误响应:', responseText);
                        alert('添加计划失败: ' + responseText);
                    }
                }
            } catch (error) {
                console.error('网络请求错误:', error);
                alert('网络连接错误，请检查服务器是否正常运行');
            }
            }
        }

        // 查看入库详情
        function viewStockInDetail(recordId) {
            const record = stockInData.find(r => r.id === recordId);
            if (record) {
                alert(`入库详情：\n单号：${record.id}\n商品：${record.productName}\n数量：${record.quantity}\n金额：￥${record.amount.toFixed(2)}\n时间：${record.time}`);
            }
        }

        // 页面加载时渲染数据
        window.onload = function() {
            loadPlansData(); // 加载计划数据
            loadStoreData(); // 加载进货记录数据
        };
    </script>
</body>
</html> 